<template>
  <div class="w-[100%] h-[100%]">
    <ContentWrap :show-border="false">
      <el-tabs v-model="activeName" class="tabs" @tab-click="handleClick">
        <el-tab-pane name="1">
          <template #label>
            <span>全部({{ allCount }})</span>
          </template>
        </el-tab-pane>
        <el-tab-pane name="2">
          <template #label>
            <span>A商品({{ AlistTotal }})</span>
          </template>
        </el-tab-pane>
        <el-tab-pane name="3">
          <template #label>
            <span>B商品({{ BlistTotal }})</span>
          </template>
        </el-tab-pane>
        <el-tab-pane label="回收站" name="4" />
      </el-tabs>
    </ContentWrap>
    <ContentWrap :show-border="false">
      <SearchBox
        :queryForm="searchList"
        :show-export="false"
        :showExpland="true"
        @query="handleSearchQuery"
        :defaultProps="defaultProps"
        @update:export-data="handleExportData"
        @change-val="handleChange"
      />
    </ContentWrap>
    <ContentWrap :show-border="false">
      <el-row :gutter="10">
        <el-col :span="1.5" class="el-btn" v-if="activeName != '4'">
          <el-button
            type="primary"
            color="#3721FF"
            class="add-website-btn"
            @click="handleAddProduct"
          >
            <Icon class="mr-2px" icon="ep:plus" />
            创建新商品
          </el-button>
        </el-col>
        <el-col :span="1.5" class="el-btn">
          <el-button type="default" plain class="add-website-btn" @click="handleSetProduct">
            设置
          </el-button>
        </el-col>
      </el-row>
    </ContentWrap>
    <ContentWrap :show-border="false">
      <!-- 列表 -->
      <el-table
        v-loading="loading"
        :data="tableData"
        row-key="id"
        calss="orderTable"
        :header-cell-style="{ backgroundColor: 'rgb(252, 251, 254)' }"
      >
        <el-table-column>
          <template #header>
            <div class="flex table-header">
              <span
                class="text-center"
                v-for="(col, index) in columns"
                :style="{ width: col.width + 'px' }"
                :key="index"
                >{{ col.label }}</span
              >
            </div>
          </template>
          <!-- 商品信息行（跨所有列） -->
          <template #default="{ row }">
            <div
              class="flex justify-between items-center product-header align-center bg-#FBFBFB p-3 rounded-tl-lg rounded-tr-lg"
            >
              <div class="flex items-center">
                <span class="pr-10"
                  >商品ID：{{ row.id }}
                  <Icon
                    v-copyText="row.id"
                    style="cursor: pointer; padding-left: 10px"
                    icon="material-symbols:content-copy-outline"
                  />
                </span>
                <span class="pr-10">内部编码：{{ row.code }}</span>
                <div class="pr-2 w-[360px] pr-10  flex">
                  <div class="inline-block w-[300px] text-ellipsis overflow-hidden whitespace-nowrap"
                    >推广链接：
                    <a :href="row.promotionLink" v-if="row.promotionLink"
                       target="_blank" 
                       :title="`https://${row.promotionLink?.split(',')[0] }#/product?id=${row.id}&tenantId=${getTenantId()}`"
                       >
                       <span @click="goProduct(row)" class="cursor-pointer">
                         https://{{row.promotionLink?.split(',')[0] }}#/product?id={{ row.id }}&tenantId={{ getTenantId() }}
                       </span>
                    </a>
                    <span v-if="!row.promotionLink">无</span>
                  </div>
                  <div >
                    <Icon v-if="row.promotionLink"
                      v-copyText="'https://'+row.promotionLink?.split(',')[0]+'#/product?id='+ row.id+ '&tenantId=' + getTenantId()"
                      style="cursor: pointer; padding-left: 10px"
                      icon="material-symbols:content-copy-outline"
                    />
                  </div>
                </div>
                <span class="pr-10">创建时间：{{ formatDate(row.createTime) }}</span>
                <span class="pr-4">修改时间：{{ formatDate(row.updateTime) }}</span>
              </div>
              <div class="flex justify-end inline-block">
                <el-button
                  v-if="activeName == '4'"
                  type="primary"
                  color="#3721FF"
                  plain
                  link
                  size="small"
                  @click="handleRestore(row)"
                  >恢复</el-button
                >
                <el-button
                  v-if="activeName != '4'"
                  type="primary"
                  color="#3721FF"
                  plain
                  link
                  size="small"
                  @click="handleEdit(row)"
                  >编辑</el-button
                >
                <el-button
                  v-if="activeName != '4'"
                  type="primary"
                  color="#3721FF"
                  plain
                  link
                  size="small"
                  @click="handleCopyData(row)"
                  >复制</el-button
                >
                <el-button
                  v-if="activeName != '4'"
                  type="primary"
                  color="#3721FF"
                  plain
                  link
                  size="small"
                  @click="handlePreview(row)"
                  >预览</el-button
                >
                <el-dropdown trigger="click" class="ml-12px">
                  <el-button link type="primary" color="#3721FF" size="small" plain>
                    更多
                  </el-button>
                  <template #dropdown>
                    <el-dropdown-menu>
                      <el-dropdown-item @click="handlePromotionLink(row)" v-if="activeName != '4'"
                        >推广链接</el-dropdown-item
                      >
                      <el-dropdown-item @click="handleProductAnalysis" v-if="activeName != '4'"
                        >商品分析</el-dropdown-item
                      >
                      <el-dropdown-item @click="handleProductComment(row)" v-if="activeName != '4'"
                        >商品评论</el-dropdown-item
                      >
                      <el-dropdown-item @click="handleDel(row)">删除</el-dropdown-item>
                      <el-dropdown-item
                        @click="handleProductRecommend(row)"
                        v-if="activeName != '4'"
                        >推荐商品</el-dropdown-item
                      >
                    </el-dropdown-menu>
                  </template>
                </el-dropdown>
              </div>
            </div>
            <el-table :data="tableData.filter((item) => item.id === row.id)" :show-header="false">
              <!-- 实际数据列 -->
              <!-- <template> -->

              <el-table-column
                v-for="(col, index) in columns"
                :key="index"
                :prop="col.prop"
                :label="col.label"
                :width="col.width"
                align="center"
              >
                <template #default="{ row }">
                  <span v-if="col.prop === 'cover'" :class="col.class">
                    <!-- <img
                      :src="row.cover"
                      class="cursor-pointer w-64px h-64px rounded-10px"
                      alt=""
                      @click="handlePreview(row.cover)"
                    /> -->
                    <ImagePreview :src="row.cover" width="50px" height="50px" />
                  </span>
                  <div class="text-[#0000ee] cursor-pointer" v-if="col.prop === 'titleExternal'"  @click="handlePreview(row)">
                    <p>{{ row.titleExternal }}</p>
                    <p>{{ row.title }}</p>
                  </div>
                  <div v-if="col.prop === 'language'">
                    <p>{{ row.areaName }}</p>
                    <p>{{ row.language }}</p>
                  </div>
                  <div v-if="col.prop === 'deptId/createName'">
                    <p>{{ row.deptName }}</p>
                    <p>{{ row.createName }}</p>
                  </div>
                  <div v-if="col.prop === 'thaliFlag'">
                    <span>{{ String(row.thaliFlag) === '1' ? '套餐' : '单品' }}</span>
                  </div>
                  <div class="text-[14px] w-100%">
                    <div
                      :class="row?.thaliItemCount > 1 ? 'text-[#0000ee] cursor-pointer' : ''"
                      v-if="col.prop === 'originalPrice'"
                      @click="handleClickThali(row)"
                    >
                      <p>原价：{{ row?.originalPrice }}</p>
                      <p>折扣价：{{ row?.discountedPrice ?? '-' }}</p>
                      <p v-if="row?.thaliItemCount > 0">套餐：{{ row?.thaliItemCount }}</p>
                    </div>
                  </div>
                  <span
                    v-if="
                      col.prop !== 'cover' &&
                      col.prop !== 'titleExternal' &&
                      col.prop !== 'language' &&
                      col.prop !== 'deptId/createName' &&
                      col.prop !== 'thaliFlag' &&
                      col.prop !== 'originalPrice'
                    "
                    :class="col.class"
                    @click="handleClickColumn(row, col.prop)"
                  >
                    {{ row[col.prop] }}
                  </span>
                </template>
              </el-table-column>

              <!-- </template> -->
            </el-table>
          </template>
        </el-table-column>
      </el-table>
      <Pagination
        v-model:limit="queryParams.pageSize"
        v-model:page="queryParams.pageNo"
        :total="total"
        @pagination="getList"
      />
    </ContentWrap>
    <ProductRecommend ref="productRecommendRef" :show-dot="true" width="40%" title="推荐商品详情" />
    <!-- 正常删除弹窗 -->
    <ComfirmPops
      ref="deletePopsRef"
      :show-icon="true"
      width="500px"
      :show-dot="false"
      type="idTips"
      :title="activeName == '4' ? '回收站删除' : '删除'"
      :id="delSelected"
      @confirm="getDeletePops"
    >
      <template #content>
        <p>确定删除吗？</p>
      </template>
    </ComfirmPops>
    <!-- 推广链接 -->
    <ComfirmPops
      ref="promotionLinkPopsRef"
      :show-icon="false"
      width="500px"
      :show-dot="true"
      type="idTips"
      :id="selectProductId"
      title="推广链接"
      @confirm="getPromotionLinkPopsPops"
      :isFooter="false"
    >
      <template #content>
        <el-form label-width="120px" :model="copyLinkForm" ref="promotionLinkFormRef">
          <el-form-item label="站点" required>
            <p>{{ copyLinkForm.websiteName }}</p>
          </el-form-item>
          <el-form-item label="链接" required>
            <el-input
              v-model="copyLinkForm.copyPromotionLink"
              disabled
              placeholder="复制后自动关闭弹框"
            >
              <template #append>
                <el-button
                  v-copyText="copyLinkForm.copyPromotionLink"
                  type="primary"
                  style="background-color: #3721ff; color: #fff; border: none; outline: none"
                  color="#3721FF"
                  plain
                  @click="handleCopyLink"
                >
                  <Icon icon="ant-design:copy-outlined" />
                  复制
                </el-button>
              </template>
            </el-input>
          </el-form-item>
        </el-form>
      </template>
    </ComfirmPops>

    <!-- 复制数据 -->
    <ComfirmPops
      ref="copyPopsRef"
      :show-icon="false"
      width="600px"
      :show-dot="true"
      type="idTips"
      title="复制"
      :id="selectProductId"
      @confirm="getCopyPopsRefPops"
    >
      <template #content>
        <p
          class="flex items-center text-[#3721FF] pt-14px pb-14px pl-30px pr-30px bg-[#F7F6FF] rounded-[10px] t-[14px]"
        >
          <Icon icon="majesticons:exclamation-circle" />
          <span>将从原始商品除业务信息以外所有信息，创建后请您编辑差异部分</span>
        </p>
        <el-form
          label-width="120px"
          :model="copyForm"
          ref="copyFormRef"
          label-position="left"
          class="mt-20px"
        >
          <el-form-item label="部门" required>
            <!-- <el-select v-model="copyForm.deptId" placeholder="请选择部门">
              <el-option label="部门1" value="1" />
              <el-option label="部门2" value="2" />
            </el-select> -->
            <el-tree-select
              v-model="copyForm.deptId"
              :data="proDeptList"
              :props="defaultProps"
              check-strictly
              node-key="id"
              placeholder="请选择部门"
              @focus="treeSelectFocus"
              @change="treeSelectChange"
              clearable
            />
          </el-form-item>
          <el-form-item label="人员" required>
            <el-select
              v-model="copyForm.userId"
              placeholder="请选择人员"
              @change="handleUserChange"
            >
              <el-option
                v-for="item in listByUserList"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              />
            </el-select>
          </el-form-item>
          <el-form-item label="所属网站" required>
            <el-select
              v-model="copyForm.websiteId"
              placeholder="请选择所属网站"
              @change="handleWebsiteChange"
              multiple
            >
              <el-option
                v-for="item in simpleList"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              />
            </el-select>
          </el-form-item>
          <el-form-item label="复制到" required>
            <el-radio-group v-model="copyForm.type" class="flex">
              <el-radio label="1">A商品</el-radio>
              <el-radio label="2">B商品</el-radio>
            </el-radio-group>
          </el-form-item>
          <el-form-item label="关联商品" required>
            <el-switch v-model="copyForm.relatedFlag" :active-value="1" :inactive-value="0" />
          </el-form-item>
          <el-form-item label="复制商品sku" required>
            <el-switch v-model="copyForm.skuFlag" :active-value="1" :inactive-value="0" />
            <p class="text-[#999999] text-[12px] ml-10px">开启后，则确定为关联商品</p>
          </el-form-item>
        </el-form>
      </template>
    </ComfirmPops>
    <Settings ref="settingsRef" @get-set="updateGetSet" />
    <AssociationProduct ref="associationProductRef" :product-id="selectProductId" />
    <ProductView ref="productViewRef" :product-id="selectProductId" :promotionLink="selePromotionLink"/>
    <PackageList ref="packageListRef" :product-id="selectProductId" />
  </div>
</template>
<script setup lang="ts">
import * as AfterSaleApi from '@/api/mall/trade/afterSale/index'
import ProductRecommend from './proRecommended.vue'
import ProductView from './productView/index.vue'
import PackageList from './packageList.vue'
import AssociationProduct from './AssociationProduct/index.vue'
import { formatDate } from '@/utils/formatTime'
import Settings from './settings/index.vue'
import * as DeptApi from '@/api/system/dept'
import { AttrApi } from '@/api/product/attr'
import { getGlobeState, getCategoryList } from '@/api/publicInterf/index.ts'
import download from '@/utils/download'
import { getAccessToken, getTenantId } from '@/utils/auth'
import type { Spu } from '@/api/mall/product/spu'
import { getDeptUserTree } from '@/api/roll'
import { ProductApi } from '@/api/product/addProduct'
// import ProductTableColumn from './productTableColumn.vue'
const list = ref<AfterSaleApi.TradeAfterSaleVO[]>([]) // 列表的数据
const localhostLink = location.href.split('#')[0] + '#/product?id='
const loading = ref(false) // 加载状态
const treeData = ref([])
const productViewRef = ref()
const total = ref(0) // 列表总数
const proDeptList = ref()
const deletePopsRef = ref() // 删除弹窗
const associationProductRef = ref() // 关联商品弹窗
const promotionLinkPopsRef = ref() // 推广链接弹窗
const copyPopsRef = ref() // 复制弹窗
const settingsRef = ref() // 设置弹窗
const router = useRouter() // 路由对象
const delSelected = ref() // 删除选中的id
const selectProductId = ref() // 选中的id
const productRecommendRef = ref()
import { defaultProps, handleTree } from '@/utils/tree'
import { update } from 'lodash-es'
const simpleList = ref([]) //网站列表
const packageListRef = ref()
const tableData = ref([])
const AtableData = ref([]) //A商品列表
const BtableData = ref([]) //B商品列表
const AlistTotal = ref(0)
const allCount = ref(0)
const BlistTotal = ref(0)
const copyFormRef = ref()
const columns = ref([
  { prop: 'cover', class: '', label: '商品封面', width: '100' },
  { prop: 'titleExternal', class: '', label: '商品标题/商品标题（外部）', width: '220' },
  { prop: 'language', class: '', label: '地区/语言', width: '120' },
  { prop: 'websiteName', class: '', label: '所属网站', width: '150' },
  { prop: 'categoryName', class: '', label: '商品分类', width: '120' },
  { prop: 'thaliFlag', class: '', label: '商品形态', width: '80' },
  { prop: 'originalPrice', class: '', label: '价格', width: '120' },
  { prop: 'deptId/createName', class: '', label: '部门/创建者', width: '150' },
  {
    prop: 'correlationName',
    class: 'text-[#3721FF] cursor-pointer',
    label: '关联商品',
    width: '180'
  }, //是否是B商品名称
  { prop: 'templateName', class: '', label: '模板', width: '120' }
])
// 确认推广链接
const copyForm = ref({
  id: null,
  deptId: null,
  deptName: null,
  userId: null,
  userName: null,
  websiteId: [],
  websiteName: [],
  type: null,
  relatedFlag: false,
  skuFlag: false
})
// 查询参数
let queryParams = reactive({
  pageNo: 1,
  pageSize: 10,
  titleExternal: undefined,
  deptId: undefined,
  createName: undefined,
  language: undefined,
  areaId: undefined,
  promotionLink: undefined,
  correlation: undefined,
  categoryId: undefined,
  websiteId: undefined,
  code: undefined,
  type: undefined
})
const activeName = ref('1')
// 导出
const handleExportData = () => {
  ProductApi.exportProduct(queryParams).then((res) => {
    ElMessage.success('导出成功')
    download.excel(res, '商品列表.xls')
  })
}
// 预览
const selePromotionLink = ref('')
const handlePreview = (row: Spu) => {
  if (SetDataMap.value.previewMode == 1) {
    productViewRef.value.show(row.id,row.promotionLink?.split(',')[0])
    selePromotionLink.value = row.promotionLink
  } else {
    window.open(
      'https://'+ row.promotionLink?.split(',')[0] +'/#/product?id=' + row.id + '&tenantId=' + getTenantId(),
      '_blank'
    )
    // window.open(
    //   'http://172.17.13.177:81/#/product?id=' + row.id + '&tenantId=' + getTenantId(),
    //   '_blank'
    // )
  }
}
// 推广链接
const goProduct = (row: Spu) => {
  window.open(
    'https://'+ row.promotionLink?.split(',')[0] +'/#product?id='+row.id+'&tenantId='+getTenantId(),
    '_blank'
  )
}
// 获取所属网站的name
const handleWebsiteChange = (val) => {
  let mywebsiteName = []
  let myWebsiteId = []
  simpleList.value.forEach((item) => {
    val.forEach((itemVal) => {
      if (item.value == itemVal) {
        mywebsiteName.push(item.label)
        copyForm.value.websiteName = mywebsiteName
        myWebsiteId.push(itemVal)
        copyForm.value.websiteId = myWebsiteId
      }
    })
  })
}
// 是否套餐
const handleClickThali = (row) => {
  if(row?.thaliItemCount==1){
    return
  }
  if (row?.thaliItemCount == 0) {
    return
  }
  packageListRef.value.show(row.id)
}
// 获取设置的值
const SetDataMap = ref()
const updateGetSet = (val) => {
  SetDataMap.value = val
}
// 获取人员的name
const handleUserChange = (val) => {
  listByUserList.value.forEach((item) => {
    if (item.value === val) {
      copyForm.value.userName = item.label
    }
  })
}
// 商品分类
const categoryList = ref()
const handleGetCategory = async () => {
  const res = await getCategoryList()
  categoryList.value = handleTree(res)
}
// 地区
const salesRegion = ref([]) // 地区
const handleGetGlobeState = async () => {
  try {
    const res = await getGlobeState()
    salesRegion.value = res.map((item) => ({
      label: item.stateName,
      value: item.id
    }))
  } catch (error) {
    console.error('获取全局状态失败:', error)
  }
}

// 语言
const languageList = ref([])
const handleGetGlobeStateByIdList = async () => {
  try {
    const res = await AttrApi.getLanguageList()
    languageList.value = res.map((item) => ({
      label: item,
      value: item
    }))
  } catch (error) {
    console.error('获取全局状态失败:', error)
  }
}
// 获取部门列表
const getDeptList = async () => {
  try {
    proDeptList.value = handleTree(await DeptApi.getSimpleDeptList())
  } catch (error) {
    console.error('获取部门列表失败:', error)
  }
}
//人员
const handlegetDeptUserTree = async () => {
  const res = await ProductApi.listAllSimple()
  treeData.value = res.map((item) => ({
    label: item.nickname,
    value: item.id
  }))
}
// 获取网站
const handleSimpleList = async () => {
  await ProductApi.simpleList().then((res) => {
    simpleList.value = res.map((item) => ({
      label: item.name,
      value: item.id
    }))
  })
}
const handleChange = (val) => {
  console.log(val.form, 'val888888888888')
  if (val.form.userId) {
    queryParams.userId = val.form.userId
  }
}
const selectedNode = computed(() => {
  const findNode = (data, targetId) => {
    for (const item of data) {
      if (item.id === targetId) return item
      if (item.children) {
        const found = findNode(item.children, targetId)
        if (found) return found
      }
    }
    return null
  }
  return findNode(proDeptList.value, copyForm.value.deptId)
})
//获取部门列表
const treeSelectChange = async (val) => {
  copyForm.value.userId = ''
  const selectedNodes = selectedNode.value
  copyForm.value.deptId = selectedNodes?.id
  copyForm.value.deptName = selectedNodes?.name
  console.log(selectedNodes, 'copyForm.value')

  await handleGetUserList(val)
}
// 根据部门ID获取用户下拉列表
const listByUserList = ref([]) //user列表
const handleGetUserList = async (id) => {
  await ProductApi.listByDept({ deptId: id }).then((res) => {
    listByUserList.value = res.map((item) => ({
      label: item.nickname,
      value: item.id
    }))
  })
}
// 获取列表
const getList = (type) => {
  loading.value = true
  ProductApi.getProductPage(queryParams)
    .then((res) => {
      if (type && type == '2') {
        tableData.value = res.list
      } else if (type && type == '3') {
        tableData.value = res.list
      } else if (type && type == '4') {
        tableData.value = res.list
      } else {
        tableData.value = res.list
      }
      BlistTotal.value = res.btotal
      AlistTotal.value = res.atotal
      allCount.value = res.allCount
      total.value = res.total
      loading.value = false
    })
    .catch(() => {
      loading.value = false
    })
}
// 恢复
const handleRestore = (row) => {
  // 二次确认
  ElMessageBox.confirm('确定要恢复选中的商品吗？', '提示', {
    confirmButtonText: '确定',
    cancelButtonText: '取消',
    type: 'warning'
  }).then(() => {
    ProductApi.recoveryProduct({ id: row.id }).then((res) => {
      ElMessage.success('恢复成功')
      getList(activeName.value)
    })
  })
}
// 编辑
const handleEdit = (row) => {
  router.push({ name: 'AddProduct', query: { id: row.id } })
}
// 列表点击事件
const handleClickColumn = (row, prop) => {
  // 关联商品
  if (prop == 'correlationName') {
    getrelatedGoodsList(row.id)
    // selectProductId.value = row.id
  }
}
const getrelatedGoodsList = (id) => {
  associationProductRef.value?.show(id)
}
// 推荐商品
const handleProductRecommend = (row) => {
  productRecommendRef.value.show(row)
}
const handleBatchImport = () => {}
const handleProductAnalysis = () => {
  router.push({ name: 'ProductAnalysis' })
}
const handleProductComment = (row) => {
  router.push({ name: 'ProductComment', query: { id: row.id } })
}
// 设置
const handleSetProduct = () => {
  settingsRef.value.show()
}
// 推广链接
const handlePromotionLink = (row) => {
  promotionLinkPopsRef.value.show()
  selectProductId.value = row.id
  copyLinkForm.value = row
  copyLinkForm.value.copyPromotionLink = 'https://'+row.promotionLink?.split(',')[0]+'/#/product?id=' + row.id + '&tenantId=' + getTenantId()
}
// 删除
const handleDel = (row) => {
  deletePopsRef.value.show(row.id)
}
// 确认删除
const getDeletePops = (bool, id) => {
  if (activeName.value == '4') {
    ProductApi.deleteRecycle(id).then((res) => {
      ElMessage.success('回收站删除成功')
      deletePopsRef.value.hide()
      getList(activeName.value)
    })
  } else {
    ProductApi.deleteProduct(id).then((res) => {
      ElMessage.success('删除成功')
      deletePopsRef.value.hide()
      getList(activeName.value)
    })
  }
}

const getCopyPopsRefPops = (row, id) => {
  copyForm.value.id = id
  copyForm.value.websiteId = copyForm.value.websiteId.join(',')
  copyForm.value.websiteName = copyForm.value.websiteName.join(',')
  ProductApi.copyProduct(copyForm.value).then((res) => {
    ElMessage.success('复制成功')
    getList(activeName.value)
    // 重置copyForm
    copyFormRef.value.resetFields()
  })
}
const copyLinkForm = ref({})
const getPromotionLinkPopsPops = () => {
  console.log(copyForm.value, 'copyForm.value');
  
  copyLinkForm.value = ProductApi.copyProduct(copyForm.value)
}
// 复制链接
const handleCopyLink = () => {
 let times = setTimeout(() => {
    clearTimeout(times)
    promotionLinkPopsRef.value.hide()
  }, 500)
}
// 数据复制
const handleCopyData = (row) => {
  copyPopsRef.value.show(row)
  selectProductId.value = row.id
}
const handleClick = (tabs) => {
  let activeName1 = tabs.props.name
  activeName.value = activeName1
  if (activeName1 == '1') {
    delete queryParams.type
    delete queryParams.deleted
    getList('1')
  } else if (activeName1 == '2') {
    queryParams.type = 1
    delete queryParams.deleted

    getList('2')
  } else if (activeName1 == '3') {
    queryParams.type = 2
    delete queryParams.deleted

    getList('3')
  } else if (activeName1 == '4') {
    delete queryParams.type
    queryParams.deleted = 1
    getList('4')
  }
}
const handleAddProduct = () => {
  router.push({ name: 'AddProduct', query: { type: activeName.value } })
}
// 合并单元格方法（用于商品信息行）
// 合并单元格方法
const spanMethod = ({ rowIndex, columnIndex }) => {
  // 如果是信息也，跨列所有的合并
}

// 子表格的合并方法（如果需要）
const childSpanMethod = ({ rowIndex, columnIndex }) => {
  // 合并子表格中除最后一列外的所有列
  if (columnIndex < columns.value.length - 1) {
    return {
      rowspan: 1,
      colspan: columns.value.length // 跨所有列
    }
  }
  return {
    rowspan: 1,
    colspan: 1
  }
}
const handleSearchQuery = (val) => {
  /***
   * 搜索框查询条件，目前考虑在查询时 queryParams = {...val,pageNo:1,pageSize:10}
   * */
  queryParams = { ...queryParams, ...val, pageNo: 1, pageSize: 10 }
  // queryParams = { ...val, pageNo: 1, pageSize: 10 }
  getList(activeName.value)
}

const searchList = ref([
  {
    label: '商品名称/ID',
    code: 'title',
    type: 'input'
  },
  {
    label: '归属部门',
    code: 'deptId',
    type: 'treeSelect',
    options: proDeptList
  },
  {
    label: '创建者',
    code: 'userId',
    type: 'select',
    options: treeData
  },
  {
    label: '语言',
    code: 'language',
    type: 'select',
    options: languageList
  },
  {
    label: '地区',
    code: 'areaId',
    type: 'select',
    options: salesRegion
  },
  {
    label: '推广链接',
    code: 'promotionLink',
    type: 'input'
  },
  {
    label: '关联商品',
    code: 'correlation',
    type: 'input'
  },
  {
    label: '商品分类',
    code: 'categoryId',
    type: 'treeSelect',
    options: categoryList
  },
  {
    label: '所属网站',
    code: 'websiteId',
    type: 'select',
    options: simpleList
  },
  {
    label: '内部编码',
    code: 'code',
    type: 'input'
  }
])

onMounted(() => {
  getList(activeName.value)
  getDeptList()
  handleGetGlobeStateByIdList()
  handleGetCategory()
  handleGetGlobeState()
  handleSimpleList()
  handlegetDeptUserTree()
  settingsRef.value.handleGetSet()
})
</script>
<style scoped>
@import '@/styles/website.scss';

.tabs > .el-tabs__content {
  padding: 32px;
  color: #6b778c;
  font-size: 32px;
  font-weight: 600;
}
</style>
<style lang="scss" scoped>
:deep(.cell) {
  padding-left: 0 !important;
  padding-right: 0 !important;
}
</style>
